<template>
	<view class="content">
		<!-- <view class="content-item" @click="toPage('/pages/repair/wait')"> -->
		<view class="content-item" @click="toPage('/pages/repair/repair')">
			<view class="content-item-left">
				<view class="content-item-left-title">
					待维保
				</view>
				<view class="content-item-left-dec">
					您有{{repairCount}}个待维保订单
				</view>
			</view>
			<u-image src="@/static/home/daiweibao.png" width="92rpx" height="95rpx"></u-image>
		</view>
		<view class="content-item" @click="toPage('/pages/installation/installation')">
			<view class="content-item-left">
				<view class="content-item-left-title">
					维修安装
				</view>
				<view class="content-item-left-dec">
					您共有{{installationCount}}个维修安装订单
				</view>
			</view>
			<u-image src="@/static/home/weixiuanzhuang.png" width="92rpx" height="95rpx"></u-image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				equipmentId: '',
				repairCount: 0, //待维修
				installationCount: 0, //维修安装
			}
		},
		onLoad(option) {
			this.equipmentId = option.equipmentId
			this.getCount()
		},
		methods: {
			getCount() {
				this.$u.api.maintenanceQuery({
					state: [0],
					equipmentId: this.equipmentId
				}).then(res => {
					this.repairCount = res.recordCount
				})
				this.$u.api.repairQuery({
					state: [2],
					equipmentId: this.equipmentId
				}).then(res => {
					this.installationCount = res.recordCount
				})
			},
			toPage(page) {
				uni.navigateTo({
					url: page + `?equipmentId=${this.equipmentId}`
				})
			}
		}
	}
</script>
<style>
	page {
		background-color: #F5F7FA;
	}
</style>
<style lang="scss" scoped>
	.content {
		padding: 32rpx 28rpx;

		.content-item {
			background: url('@/static/home/item.png');
			width: 100%;
			height: 200rpx;
			background-size: cover;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 47rpx 56rpx 50rpx 61rpx;
			margin-bottom: 28rpx;

			.content-item-left {
				.content-item-left-title {
					font-weight: 600;
					font-size: 36rpx;
					color: #333333;
					line-height: 50rpx;
				}

				.content-item-left-dec {
					font-weight: 400;
					font-size: 26rpx;
					color: #999999;
					line-height: 37rpx;
				}
			}
		}

	}
</style>